﻿<%@ Page Title="" Language="C#" MasterPageFile="~/sunt_AJAX.Master" AutoEventWireup="true" CodeBehind="sunt_UpdataPanel_life.aspx.cs" Inherits="sunt.AJAX.Demo.sunt.UpdataPanel.sunt_UpdataPanel_life" %>
<%@ Register src="UCControl/WebUserControl1.ascx" tagname="WebUserControl1" tagprefix="uc1" %>
<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
    <title>UpdataPanel的生命周期</title>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
<ul>
    <li>PageRequestManager</li>
    <li>PageRequestManager 类是客户端的类，用于协调ScriptManager和UpdatePanel控件，管理页面上的异步更新操作。通过 PageRequestManager客户端的实例我们可以深入到在客户端页面生命周期中，更细致地操作客户端的页面</li>
    <li>常用方法：getInstance 静态方法：获取全局唯一的PageRequestManager实例</li>
    <li>isInAsyncPostBack属性：是否正处于一个一步刷新的过程中</li>
    <li>abortPostBack方法：取消当前的异步刷新，不会产生异常</li>
</ul>
<ul>
    <li>App-Init事件</li>
    <li>基于浏览器的window.onload事件</li>
    <li>只在页面第一次初始化时出发</li>
    <li>所有的脚本已经加载完毕</li>
    <li>所有的组件还没有开始创建</li>
    <li>用于创建各种组件</li>
    <li>为组件创建相互引用关系的时期</li>
</ul>
<ul>
    <li>App-Load与Unload</li>
    <li>参数类型：Sys.ApplicationLoadEventArgs</li>
    <li>components:获得这次加载过程中所有建立的对象</li>
    <li>isPartialLoad：是否异步调用的导致的页面加载</li>
</ul>
<ul>
    <li>PRM-initializeRequest事件</li>
    <li>参数类型：  InitializeRequestEventArgs</li>
    <li>request属性:用于获取Webrequest对象（用于请求的信息）</li>
    <li>postBackElement:触发异步刷新的DOM元素</li>
    <li>常用操作</li>
    <li>读取请求信息</li>
    <li>取消此次异步更新</li>
</ul>
<hr />
    <asp:UpdateProgress ID="UpdateProgress1" runat="server" AssociatedUpdatePanelID="UpdatePanel1">
        <ProgressTemplate>
            <span style="color:Red">Loading</span>
        </ProgressTemplate>
    </asp:UpdateProgress>
    <asp:UpdatePanel ID="UpdatePanel1" runat="server">
        <ContentTemplate>
            <%=DateTime.Now %>
            <asp:Label ID="Label1" runat="server" Text=""></asp:Label>
            <asp:Button ID="Button1" runat="server" Text="优先" onclick="Button_Click" />
            <asp:Button ID="Button2" runat="server" Text="普通" onclick="Button_Click" />

        </ContentTemplate>
    </asp:UpdatePanel>
    <script type="text/javascript">
        var lastPostBackButtonId = null; //上次发起提交的按钮id；
        var btnPrecedentid = "<%=this.Button1.ClientID %>";
        Sys.WebForms.PageRequestManager.getInstance().add_initializeRequest(
            function (sender, e) {
                var prm = Sys.WebForms.PageRequestManager.getInstance();
                //alert(prm.get_isInAsyncPostBack());
                if (prm.get_isInAsyncPostBack()) {//是否存在一个异步刷新
                   // alert(lastPostBackButtonId+"-"+btnPrecedentid);
                    if (lastPostBackButtonId == btnPrecedentid) {//上次发起提交的是否为优先级高的按钮
                        e.set_cancel(true);
                        if (e.get_postBackElement().id == btnPrecedentid) {
                            showMessage("不可重复发起优先的刷新");
                        }
                        else {
                            showMessage("请等待优先的刷新结束");
                        }
                    }
                    else if (e.get_postBackElement().id == btnPrecedentid) {
                        showMessage("发起优先的刷新，普通的刷新将被取消");
                    }
                    else {
                        showMessage("重新发起普通的刷新。前一次将被取消");
                    }
                }
                lastPostBackButtonId = e.get_postBackElement().id;
                //alert( e.get_postBackElement().id);
            }
        );
    </script>
<hr />
<ul>
    <li>PRM-beginRequest事件</li>
    <li>参数类型：BeginRequestEventArgs</li>
    <li>request:获取WebRequest对象（用于请求信息）</li>
    <li>postBackElement:出发异步刷新的DOM元素</li>
    <li>常用操作</li>
    <li>读取请求信息</li>
    <li>改变请求方式</li>
    <li>显示更新提示</li>
</ul>
<hr />
    <h3>强制显示UpdataProgress</h3>
    <asp:UpdateProgress ID="UpdateProgress2" runat="server" AssociatedUpdatePanelID="UpdatePanel2" DisplayAfter="0" DynamicLayout="false">
        <ProgressTemplate>
            <span style="color:Red">Loading</span>
        </ProgressTemplate>
    </asp:UpdateProgress>
    <asp:UpdatePanel ID="UpdatePanel2" runat="server">
        <ContentTemplate>
            <%=DateTime.Now %>
            <asp:Button ID="Button3" runat="server" Text="Button" OnClick="Button_Click" />
        </ContentTemplate>
        <Triggers>
            <asp:AsyncPostBackTrigger ControlID="Button4" />
        </Triggers>
    </asp:UpdatePanel>
    <asp:Button ID="Button4" runat="server" Text="Button" OnClick="Button_Click" />
    <script type="text/javascript">
        Sys.WebForms.PageRequestManager.getInstance().add_beginRequest(function (sender, e) {
            if (e.get_postBackElement().id != "<%=this.Button4.ClientID %>") {
                return;
            }
            var progress=$get("<%=this.UpdateProgress2.ClientID %>")
            var dynamicLayout=<%=this. UpdateProgress2.DynamicLayout.ToString().ToLower()%>;
            //控制UpdataProgress是否出现
            if(dynamicLayout)
            {
                progress.style.display="block";
            }
            else
            {
                 progress.style.visibility="visible";
            }
        });
    </script>
<hr />
<ul>
    <li>PRM-PageLoding事件</li>
    <li>参数类型：PageLoadingEventArgs</li>
    <li>dataItem属性:获得服务器端注册的数据项</li>
    <li>panelsDeleting属性：获得即将删除的UpdataPanel，只会出现在嵌套的UpdataPanel中</li>
    <li>panelsUpdatationg:获得即将更新的UpdataPanel</li>
    <li>常用操作</li>
    <li>提示更新的UpdataPenl</li>
    <li>获得服务器端的注册项</li>
</ul>
<h3>提示正在更新的UpdataPanel</h3>

    <uc1:WebUserControl1 ID="WebUserControl11" runat="server" />
    <uc1:WebUserControl1 ID="WebUserControl12" runat="server" />
    <uc1:WebUserControl1 ID="WebUserControl13" runat="server" />
    <uc1:WebUserControl1 ID="WebUserControl14" runat="server" />
    <uc1:WebUserControl1 ID="WebUserControl15" runat="server" />
    <asp:Button ID="Button5" runat="server" Text="Button" />
    <script type="text/javascript">
        function highlightPanels(panels, clear) {
            for (var i = 0; i < panels.length; i++) {
                var panel = panels[i];
                panel.style.boder = clear ? "solid 0px white" : "solid 5px red";
                panel.style.backgroundColor = clear ? "white" : "#d6dde8";
            }
        }
        Sys.WebForms.PageRequestManager.getInstance().add_pageLoading(function (sender, e) {
            var panelsUpdatading = Array.clone(e.get_panelsUpdating());
            highlightPanels(panelsUpdatading);
            window.setTimeout(
                function () { highlightPanels(panelsUpdatading, true); },
                2000
            );
        });
    </script>
<ul>
    <li>PRM-PageLoaded事件</li>
    <li>参数类型:PageLoadedEventArgs</li>
    <li>dataItems属性：获得服务器端注册的数据项</li>
    <li>panelsCreated:获得新创建的UpdataPanel（嵌套的情况下）</li>
    <li>panelsUpdataed:获得已经更新的UpdataPanel</li>
    <li>常用操作</li>
    <li>获得服务器端注册的数据项</li>
    <li>执行服务器端注册的脚本</li>
</ul>
<h3>局部内容的添加</h3>
<div id="commentContainer"></div>
    <asp:UpdatePanel ID="UpdatePanel3" runat="server">
        <ContentTemplate>
              <asp:Repeater ID="Repeater1" runat="server">
                <ItemTemplate>
                     <%#(Container.DataItem as sunt.AJAX.Demo.sunt.UpdataPanel.Comment).Content %><br />
                    <i><%#(Container.DataItem as sunt.AJAX.Demo.sunt.UpdataPanel.Comment).Time %></i><hr />
                </ItemTemplate>
             </asp:Repeater>
        </ContentTemplate>
        <Triggers><asp:AsyncPostBackTrigger  ControlID="Button6" /></Triggers>
    </asp:UpdatePanel>
    <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
    <asp:Button ID="Button6" runat="server" Text="Button" onclick="Button6_Click" />
    <script type="text/javascript">
        Sys.WebForms.PageRequestManager.getInstance().add_pageLoaded(
            function (sender, e) {
                var upId = "<%=this. UpdatePanel3.ClientID%>";
                var refreshedPanels = e.get_panelsUpdated();
                for (var i = 0; i < refreshedPanels.length; i++) {
                    if (refreshedPanels[i].id == upId) {
                        refreshedPanels[i].id = upId + Math.floor(9999 * Math.random());
                        var div = document.createElement("div");
                        div.id = upId; //新创建的div作为要更新的UpdataPanel

                        $get("commentContainer").appendChild(div);

                        return;
                    }
                }
            }
        );
    </script>
<ul>
    <li>PRM-endRequest事件</li>
    <li>参数类型：EndRequestEventArgs</li>
    <li>dataItems属性：获得服务器端注册的数据项</li>
    <li>error属性：获得异步刷新时遇到的错误</li>
    <li>errorHandled属性：表明错误是否已被处理了</li>
    <li>response属性：获得这次请求获得的结果对象</li>
    <li>常用操作</li>
    <li>处理异步刷新的结果（异常、超时、取消等等）</li>
    <li>获得请求结果中额外的信息</li>
    <li>获得服务器端注册的数据项</li>
</ul>
<h3>获得页面的信息</h3>
    <asp:UpdatePanel ID="UpdatePanel4" runat="server">
        <ContentTemplate>
            <%=DateTime.Now %>
            <asp:Button ID="Button7" runat="server" Text="Error" onclick="Button7_Click" />
            <asp:Button ID="Button8" runat="server" Text="TimeOut" 
                onclick="Button8_Click" />
            <input id="Button9" type="button" value="Abort" onclick="abort()" />
            <asp:Button ID="Button10" runat="server" Text="Register DataItem" 
                onclick="Button10_Click" />
        </ContentTemplate>
    </asp:UpdatePanel>
<script type="text/javascript">
    Sys.WebForms.PageRequestManager.getInstance().add_endRequest(
        function (sender, e) {
            if (e.get_error()) {
                e.set_errorHandled(true);
                if (e.get_response().get_timedOut()) {
                    showMessage("你的请求已超时");
                }
                else if (e.get_response().get_stateCode != 200) {
                    showMessage("遇到未知错误");
                }
                else {
                    showMessage(e.get_error().message);
                }
            }
            else if (e.get_response().get_aborted()) {
                showMessage("你已取消了此次更新");
            }
            else {
                var upid = "<%=this.UpdatePanel4.ClientID %>";
                var item=e.get_dataItems()[upid];
                showMessage("你注册了："+item);
            }
        }
     );

        function abort() {
            Sys.WebForms.PageRequestManager.getInstance().abortPostBack();
        }
</script>
</asp:Content>
